<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core" 
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:c="http://xmlns.jcp.org/jsp/jstl/core">
    <h:head>
        <title>Calendar</title>
        <h:outputStylesheet library="css" name="main.css"  />
    </h:head>
    <h:body>
        <div id="container">
            <ui:include src="logo.xhtml" />
            <div id="actionMenu">
                <h:form>
                    <p:commandButton value="Notifications #{notificationsBean.getNotificationsCount()}" 
                                     id="openNotifButton"/>
                    <p:overlayPanel id="Notifications" for="openNotifButton" hideEffect="fade" dynamic="true" style="width:600px">
                        <c:set var="notifications" value="#{notificationsBean.getInvitations()}" scope="request" />

                        <c:forEach var="wa" items="#{notificationsBean.getWeatherAlerts()}" varStatus="status">
                            <div class="notification" id="notificationsMenu">
                                <p><b>Bad weather</b> detected for <em><b>#{wa.getEvent().getTitle()}</b></em>
                                    on #{notificationsBean.formatDate(wa.getEvent().getStartDate())}</p>
                                <c:if test="#{wa.getAlternativeDate() != null}" >
                                    <p>The closest sunny day is <b>#{notificationsBean.formatDate(wa.getAlternativeDate())}</b></p>
                                </c:if>
                                <h:form>
                                    <p:commandLink value="Dismiss notification" class="declineButton"
                                                   action="#{notificationsBean.markAsViewedWeatherAlert(wa)}"/>
                                    <c:if test="#{wa.getEvent().getOwner() == calendarBean.getLoggedUser()}" >
                                        <p:commandLink value="Reschedule Event" class="acceptButton"
                                                       action="#{notificationsBean.openEventForRescheduling(wa)}"/>
                                    </c:if>
                                </h:form>
                            </div>
                        </c:forEach>

                        <c:forEach var="notif" items="#{notificationsBean.getInvitations()}" varStatus="status">
                            <div class="notification" id="notificationsMenu">
                                <p><b>#{notif.getEvent().getCalendar().getOwner().getFullName()}</b>
                                    invited you to the event <em><b>#{notif.getEvent().getTitle()}</b></em>
                                    on <b>#{notificationsBean.formatDate(notif.getEvent().getStartDate())}</b></p>
                                <h:form>
                                    <p:commandLink value="Accept" class="acceptButton"
                                                   action="#{notificationsBean.acceptInvitation(notif)}"/>
                                    <p:commandLink value="Decline" class="declineButton"
                                                   action="#{notificationsBean.declineInvitation(notif)}"/>
                                </h:form>
                            </div>
                        </c:forEach>
                        <c:if test="#{notificationsBean.getInvitations().isEmpty() and notificationsBean.getWeatherAlerts().isEmpty()}">
                            <p>No new notifications for now.</p>
                        </c:if>
                    </p:overlayPanel>
                    <p:button value="Settings" outcome="settings" />             
                    <p:commandButton action="#{loginBean.logout()}" value="Logout" />

                    <p:autoComplete value="#{calendarBean.searchedUser}" 
                                    completeMethod="#{userSearchBean.completeUserSearch}" 
                                    var="user1"
                                    itemLabel="#{user1.getFullName()}"
                                    itemValue="#{user1}" 
                                    converter="inviteeConverter"
                                    forceSelection="true"
                                    placeholder="Search for Users">
                        <p:ajax event="itemSelect" listener="#{userSearchBean.onUserSelect}" />
                    </p:autoComplete>


                </h:form>
            </div>

            <h:form id="fullPageForm">
                <p:panel header="Settings">
                    <h:panelGrid columns="3" cellpadding="5">
                        <h:outputLabel for="name" value="Name*:" />
                        <p:inputText id="name" value="#{settingsBean.user.name}" label="Name" >
                            <p:ajax update="namemsg" event="keyup" />
                        </p:inputText>
                        <p:message for="name" id="namemsg"/>

                        <h:outputLabel for="surname" value="Surname*:" />
                        <p:inputText id="surname" value="#{settingsBean.user.surname}" label="Surname" >
                            <p:ajax update="surnamemsg" event="keyup" />
                        </p:inputText>
                        <p:message for="surname" id="surnamemsg"/>

                        <h:outputLabel for="address" value="Address:" />
                        <p:inputText id="address" value="#{settingsBean.user.address}" label="address" >
                            <p:ajax update="addressmsg" event="keyup" />
                        </p:inputText>
                        <p:message for="address" id="addressmsg"/>

                        <h:outputLabel for="city" value="City:" />
                        <p:inputText id="city" value="#{settingsBean.user.city}" label="city" >
                            <p:ajax update="citymsg" event="keyup" />
                        </p:inputText>
                        <p:message for="city" id="citymsg"/>

                        <h:outputLabel for="country" value="Country:" />
                        <p:inputText id="country" value="#{settingsBean.user.country}" label="country" >
                            <p:ajax update="countrymsg" event="keyup" />
                        </p:inputText>
                        <p:message for="country" id="countrymsg"/>

                        <h:outputLabel for="publicCalendar" value="Public Calendar:" />
                        <p:selectBooleanCheckbox id="publicCalendar" value="#{settingsBean.calendar.publicCalendar}" />
                        <p:message for="publicCalendar" id="publicCalendarmsg"/>

                        <h:outputLabel for="enableEmail" value="Email Notifications:" />
                        <p:selectBooleanCheckbox id="enableEmail" value="#{settingsBean.user.emailEnabled}" />
                        <p:message for="enableEmail" id="enableEmailmsg"/>
                    </h:panelGrid>

                    <div style="clear:both;" />
                    <p:commandButton value="Save" ajax="false" validateClient="true" styleClass="ui-priority-primary" style="float:right;"
                                     action="#{settingsBean.save()}"/>
                    <div style="clear:both;" />

                </p:panel>
            </h:form>

        </div>       
    </h:body>
</html>

